<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>iconfont Demo</title>
  <link rel="shortcut icon" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg" type="image/x-icon"/>
  <link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg"/>
  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
  <link rel="stylesheet" href="demo.css">
  <link rel="stylesheet" href="iconfont.css">
  <script src="iconfont.js"></script>
  <!-- jQuery -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
  <!-- 代码高亮 -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
  <style>
    .main .logo {
      margin-top: 0;
      height: auto;
    }

    .main .logo a {
      display: flex;
      align-items: center;
    }

    .main .logo .sub-title {
      margin-left: 0.5em;
      font-size: 22px;
      color: #fff;
      background: linear-gradient(-45deg, #3967FF, #B500FE);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
  </style>
</head>
<body>
  <div class="main">
    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
      <img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
      
    </a></h1>
    <div class="nav-tabs">
      <ul id="tabs" class="dib-box">
        <li class="dib active"><span>Unicode</span></li>
        <li class="dib"><span>Font class</span></li>
        <li class="dib"><span>Symbol</span></li>
      </ul>
      
    </div>
    <div class="tab-container">
      <div class="content unicode" style="display: block;">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
              <span class="icon iconfont">&#xe602;</span>
                <div class="name">分享</div>
                <div class="code-name">&amp;#xe602;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe603;</span>
                <div class="name">分享</div>
                <div class="code-name">&amp;#xe603;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe604;</span>
                <div class="name">评论</div>
                <div class="code-name">&amp;#xe604;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60a;</span>
                <div class="name">视频</div>
                <div class="code-name">&amp;#xe60a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe618;</span>
                <div class="name">充值</div>
                <div class="code-name">&amp;#xe618;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe619;</span>
                <div class="name">地址</div>
                <div class="code-name">&amp;#xe619;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe635;</span>
                <div class="name">客服</div>
                <div class="code-name">&amp;#xe635;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe609;</span>
                <div class="name">iconfont-7tian</div>
                <div class="code-name">&amp;#xe609;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60b;</span>
                <div class="name">iconfont-15tianwuliyoutuihuo(1)</div>
                <div class="code-name">&amp;#xe60b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60c;</span>
                <div class="name">iconfont-baoyou(1)</div>
                <div class="code-name">&amp;#xe60c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60d;</span>
                <div class="name">iconfont-iconposition(1)</div>
                <div class="code-name">&amp;#xe60d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60e;</span>
                <div class="name">iconfont-kuaixiufuwu(1)</div>
                <div class="code-name">&amp;#xe60e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60f;</span>
                <div class="name">iconfont-zaixiankefu(1)</div>
                <div class="code-name">&amp;#xe60f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe610;</span>
                <div class="name">iconfont-1</div>
                <div class="code-name">&amp;#xe610;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe611;</span>
                <div class="name">iconfont-2</div>
                <div class="code-name">&amp;#xe611;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe612;</span>
                <div class="name">iconfont-7tian</div>
                <div class="code-name">&amp;#xe612;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe614;</span>
                <div class="name">iconfont-angle-left</div>
                <div class="code-name">&amp;#xe614;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe615;</span>
                <div class="name">iconfont-angle-right</div>
                <div class="code-name">&amp;#xe615;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe616;</span>
                <div class="name">iconfont-angle-up</div>
                <div class="code-name">&amp;#xe616;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61a;</span>
                <div class="name">iconfont-cite</div>
                <div class="code-name">&amp;#xe61a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61b;</span>
                <div class="name">iconfont-delete</div>
                <div class="code-name">&amp;#xe61b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61c;</span>
                <div class="name">iconfont-disorder</div>
                <div class="code-name">&amp;#xe61c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61d;</span>
                <div class="name">iconfont-down</div>
                <div class="code-name">&amp;#xe61d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61e;</span>
                <div class="name">iconfont-grid</div>
                <div class="code-name">&amp;#xe61e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61f;</span>
                <div class="name">iconfont-iconfontcart</div>
                <div class="code-name">&amp;#xe61f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe620;</span>
                <div class="name">iconfont-iconfontclose</div>
                <div class="code-name">&amp;#xe620;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe621;</span>
                <div class="name">iconfont-iconfontclosefill</div>
                <div class="code-name">&amp;#xe621;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe622;</span>
                <div class="name">iconfont-iconfontdingwei</div>
                <div class="code-name">&amp;#xe622;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe623;</span>
                <div class="name">iconfont-iconfonterweima</div>
                <div class="code-name">&amp;#xe623;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe624;</span>
                <div class="name">iconfont-iconfontroundadd</div>
                <div class="code-name">&amp;#xe624;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe625;</span>
                <div class="name">iconfont-iconfontroundaddfill</div>
                <div class="code-name">&amp;#xe625;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe626;</span>
                <div class="name">iconfont-iconfontweibo</div>
                <div class="code-name">&amp;#xe626;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe627;</span>
                <div class="name">iconfont-iconfontweizhi</div>
                <div class="code-name">&amp;#xe627;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe628;</span>
                <div class="name">iconfont-iconposition(1)</div>
                <div class="code-name">&amp;#xe628;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe629;</span>
                <div class="name">iconfont-kuaixiufuwu(1)</div>
                <div class="code-name">&amp;#xe629;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62a;</span>
                <div class="name">iconfont-left(1)</div>
                <div class="code-name">&amp;#xe62a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62b;</span>
                <div class="name">iconfont-left</div>
                <div class="code-name">&amp;#xe62b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62c;</span>
                <div class="name">iconfont-list</div>
                <div class="code-name">&amp;#xe62c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62d;</span>
                <div class="name">iconfont-phonebook</div>
                <div class="code-name">&amp;#xe62d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62e;</span>
                <div class="name">iconfont-qm</div>
                <div class="code-name">&amp;#xe62e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62f;</span>
                <div class="name">iconfont-right(1)</div>
                <div class="code-name">&amp;#xe62f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe630;</span>
                <div class="name">iconfont-right</div>
                <div class="code-name">&amp;#xe630;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe631;</span>
                <div class="name">iconfont-socialgoogle</div>
                <div class="code-name">&amp;#xe631;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe632;</span>
                <div class="name">iconfont-socialgoogleoutline</div>
                <div class="code-name">&amp;#xe632;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe633;</span>
                <div class="name">iconfont-socialgoogleplus</div>
                <div class="code-name">&amp;#xe633;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe634;</span>
                <div class="name">iconfont-socialgoogleplusoutline</div>
                <div class="code-name">&amp;#xe634;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe636;</span>
                <div class="name">iconfont-socialjavascript</div>
                <div class="code-name">&amp;#xe636;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe637;</span>
                <div class="name">iconfont-socialhtml5</div>
                <div class="code-name">&amp;#xe637;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe638;</span>
                <div class="name">iconfont-socialhtml5outline</div>
                <div class="code-name">&amp;#xe638;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe639;</span>
                <div class="name">iconfont-socialjavascript</div>
                <div class="code-name">&amp;#xe639;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63a;</span>
                <div class="name">iconfont-socialjavascriptoutline</div>
                <div class="code-name">&amp;#xe63a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63b;</span>
                <div class="name">iconfont-socialtumblr</div>
                <div class="code-name">&amp;#xe63b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63c;</span>
                <div class="name">iconfont-socialtumblroutline</div>
                <div class="code-name">&amp;#xe63c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63d;</span>
                <div class="name">iconfont-star</div>
                <div class="code-name">&amp;#xe63d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63e;</span>
                <div class="name">iconfont-trash</div>
                <div class="code-name">&amp;#xe63e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63f;</span>
                <div class="name">iconfont-up</div>
                <div class="code-name">&amp;#xe63f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe640;</span>
                <div class="name">iconfont-zaixiankefu(1)</div>
                <div class="code-name">&amp;#xe640;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xea7b;</span>
                <div class="name">皮肤</div>
                <div class="code-name">&amp;#xea7b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xea7c;</span>
                <div class="name">工具</div>
                <div class="code-name">&amp;#xea7c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb36;</span>
                <div class="name">视频</div>
                <div class="code-name">&amp;#xeb36;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xebfe;</span>
                <div class="name">聊天</div>
                <div class="code-name">&amp;#xebfe;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xebff;</span>
                <div class="name">附近</div>
                <div class="code-name">&amp;#xebff;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec00;</span>
                <div class="name">推荐</div>
                <div class="code-name">&amp;#xec00;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe613;</span>
                <div class="name">官方客服</div>
                <div class="code-name">&amp;#xe613;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe874;</span>
                <div class="name">more-circle</div>
                <div class="code-name">&amp;#xe874;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64f;</span>
                <div class="name">进行中</div>
                <div class="code-name">&amp;#xe64f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe653;</span>
                <div class="name">查看 搜索</div>
                <div class="code-name">&amp;#xe653;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe641;</span>
                <div class="name">打开</div>
                <div class="code-name">&amp;#xe641;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68b;</span>
                <div class="name">查询</div>
                <div class="code-name">&amp;#xe68b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe642;</span>
                <div class="name">合作伙伴</div>
                <div class="code-name">&amp;#xe642;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe643;</span>
                <div class="name">项目复盘</div>
                <div class="code-name">&amp;#xe643;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe644;</span>
                <div class="name">所有项目进度</div>
                <div class="code-name">&amp;#xe644;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe645;</span>
                <div class="name">详细方案</div>
                <div class="code-name">&amp;#xe645;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe646;</span>
                <div class="name">积分记录</div>
                <div class="code-name">&amp;#xe646;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe647;</span>
                <div class="name">技术评估</div>
                <div class="code-name">&amp;#xe647;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe648;</span>
                <div class="name">需求管理</div>
                <div class="code-name">&amp;#xe648;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe649;</span>
                <div class="name">竣工交付</div>
                <div class="code-name">&amp;#xe649;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64a;</span>
                <div class="name">技术踏勘</div>
                <div class="code-name">&amp;#xe64a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64b;</span>
                <div class="name">请假审批</div>
                <div class="code-name">&amp;#xe64b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64c;</span>
                <div class="name">实施采购</div>
                <div class="code-name">&amp;#xe64c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64d;</span>
                <div class="name">实施踏勘</div>
                <div class="code-name">&amp;#xe64d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64e;</span>
                <div class="name">项目管理</div>
                <div class="code-name">&amp;#xe64e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe650;</span>
                <div class="name">项目报备</div>
                <div class="code-name">&amp;#xe650;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe651;</span>
                <div class="name">项目启动</div>
                <div class="code-name">&amp;#xe651;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe652;</span>
                <div class="name">实施管理</div>
                <div class="code-name">&amp;#xe652;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe654;</span>
                <div class="name">手机配置</div>
                <div class="code-name">&amp;#xe654;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe655;</span>
                <div class="name">Bug管理</div>
                <div class="code-name">&amp;#xe655;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe656;</span>
                <div class="name">部门管理</div>
                <div class="code-name">&amp;#xe656;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe657;</span>
                <div class="name">项目评价</div>
                <div class="code-name">&amp;#xe657;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe658;</span>
                <div class="name">文档管理</div>
                <div class="code-name">&amp;#xe658;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe659;</span>
                <div class="name">I需求对接</div>
                <div class="code-name">&amp;#xe659;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe65a;</span>
                <div class="name">合同拟定</div>
                <div class="code-name">&amp;#xe65a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe65b;</span>
                <div class="name">项目清单</div>
                <div class="code-name">&amp;#xe65b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe65c;</span>
                <div class="name">初步方案</div>
                <div class="code-name">&amp;#xe65c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe65d;</span>
                <div class="name">最终方案</div>
                <div class="code-name">&amp;#xe65d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe65e;</span>
                <div class="name">暂停项目</div>
                <div class="code-name">&amp;#xe65e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe65f;</span>
                <div class="name">III实施交付</div>
                <div class="code-name">&amp;#xe65f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe660;</span>
                <div class="name">项目文件</div>
                <div class="code-name">&amp;#xe660;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe661;</span>
                <div class="name">项目详情</div>
                <div class="code-name">&amp;#xe661;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe662;</span>
                <div class="name">项目详情</div>
                <div class="code-name">&amp;#xe662;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe663;</span>
                <div class="name">II落地签约</div>
                <div class="code-name">&amp;#xe663;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe664;</span>
                <div class="name">新闻公告</div>
                <div class="code-name">&amp;#xe664;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe617;</span>
                <div class="name">icon-时间</div>
                <div class="code-name">&amp;#xe617;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe56a;</span>
                <div class="name">城市</div>
                <div class="code-name">&amp;#xe56a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe608;</span>
                <div class="name">数据</div>
                <div class="code-name">&amp;#xe608;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe897;</span>
                <div class="name">保险-线</div>
                <div class="code-name">&amp;#xe897;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe899;</span>
                <div class="name">返回2-线</div>
                <div class="code-name">&amp;#xe899;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe89a;</span>
                <div class="name">更多-线</div>
                <div class="code-name">&amp;#xe89a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b9;</span>
                <div class="name">面性-礼物</div>
                <div class="code-name">&amp;#xe6b9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe665;</span>
                <div class="name">手机号icon</div>
                <div class="code-name">&amp;#xe665;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe669;</span>
                <div class="name">搜索</div>
                <div class="code-name">&amp;#xe669;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe601;</span>
                <div class="name">版本信息</div>
                <div class="code-name">&amp;#xe601;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe605;</span>
                <div class="name">检查更新</div>
                <div class="code-name">&amp;#xe605;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe606;</span>
                <div class="name">登陆登入</div>
                <div class="code-name">&amp;#xe606;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe607;</span>
                <div class="name">上传文件</div>
                <div class="code-name">&amp;#xe607;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe666;</span>
                <div class="name">切换标签非是</div>
                <div class="code-name">&amp;#xe666;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe667;</span>
                <div class="name">刷新同步</div>
                <div class="code-name">&amp;#xe667;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe668;</span>
                <div class="name">刷新项目</div>
                <div class="code-name">&amp;#xe668;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66a;</span>
                <div class="name">退出登出</div>
                <div class="code-name">&amp;#xe66a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66b;</span>
                <div class="name">设置服务器</div>
                <div class="code-name">&amp;#xe66b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66c;</span>
                <div class="name">下载底稿</div>
                <div class="code-name">&amp;#xe66c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66d;</span>
                <div class="name">疑问</div>
                <div class="code-name">&amp;#xe66d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66e;</span>
                <div class="name">汇总解锁</div>
                <div class="code-name">&amp;#xe66e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66f;</span>
                <div class="name">检查</div>
                <div class="code-name">&amp;#xe66f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe670;</span>
                <div class="name">打开文件夹</div>
                <div class="code-name">&amp;#xe670;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe671;</span>
                <div class="name">设置工作目录</div>
                <div class="code-name">&amp;#xe671;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe672;</span>
                <div class="name">上传错误日志</div>
                <div class="code-name">&amp;#xe672;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe673;</span>
                <div class="name">切换报告明细</div>
                <div class="code-name">&amp;#xe673;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe674;</span>
                <div class="name">版本管理</div>
                <div class="code-name">&amp;#xe674;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe675;</span>
                <div class="name">标签解锁</div>
                <div class="code-name">&amp;#xe675;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe676;</span>
                <div class="name">带标签</div>
                <div class="code-name">&amp;#xe676;</div>
              </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="unicode-">Unicode 引用</h2>
          <hr>

          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
          <ul>
            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
            <li>默认情况下不支持多色，直接添加多色图标会自动去色。</li>
          </ul>
          <blockquote>
            <p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p>
          </blockquote>
          <p>Unicode 使用步骤如下：</p>
          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
  font-family: 'iconfont';
  src: url('iconfont.ttf?t=1664362924182') format('truetype');
}
</code></pre>
          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
          <blockquote>
            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
          </blockquote>
          </div>
      </div>
      <div class="content font-class">
        <ul class="icon_lists dib-box">
          
          <li class="dib">
            <span class="icon iconfont icon-fenxiang"></span>
            <div class="name">
              分享
            </div>
            <div class="code-name">.icon-fenxiang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fenxiang2"></span>
            <div class="name">
              分享
            </div>
            <div class="code-name">.icon-fenxiang2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-pinglun"></span>
            <div class="name">
              评论
            </div>
            <div class="code-name">.icon-pinglun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shipin"></span>
            <div class="name">
              视频
            </div>
            <div class="code-name">.icon-shipin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-chongzhi"></span>
            <div class="name">
              充值
            </div>
            <div class="code-name">.icon-chongzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dizhi"></span>
            <div class="name">
              地址
            </div>
            <div class="code-name">.icon-dizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-kefu"></span>
            <div class="name">
              客服
            </div>
            <div class="code-name">.icon-kefu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfont7tian"></span>
            <div class="name">
              iconfont-7tian
            </div>
            <div class="code-name">.icon-iconfont7tian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfont15tianwuliyoutuihuo1"></span>
            <div class="name">
              iconfont-15tianwuliyoutuihuo(1)
            </div>
            <div class="code-name">.icon-iconfont15tianwuliyoutuihuo1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontbaoyou1"></span>
            <div class="name">
              iconfont-baoyou(1)
            </div>
            <div class="code-name">.icon-iconfontbaoyou1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfonticonposition1"></span>
            <div class="name">
              iconfont-iconposition(1)
            </div>
            <div class="code-name">.icon-iconfonticonposition1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontkuaixiufuwu1"></span>
            <div class="name">
              iconfont-kuaixiufuwu(1)
            </div>
            <div class="code-name">.icon-iconfontkuaixiufuwu1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontzaixiankefu1"></span>
            <div class="name">
              iconfont-zaixiankefu(1)
            </div>
            <div class="code-name">.icon-iconfontzaixiankefu1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfont1"></span>
            <div class="name">
              iconfont-1
            </div>
            <div class="code-name">.icon-iconfont1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfont2"></span>
            <div class="name">
              iconfont-2
            </div>
            <div class="code-name">.icon-iconfont2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfont7tian1"></span>
            <div class="name">
              iconfont-7tian
            </div>
            <div class="code-name">.icon-iconfont7tian1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontangleleft"></span>
            <div class="name">
              iconfont-angle-left
            </div>
            <div class="code-name">.icon-iconfontangleleft
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontangleright"></span>
            <div class="name">
              iconfont-angle-right
            </div>
            <div class="code-name">.icon-iconfontangleright
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontangleup"></span>
            <div class="name">
              iconfont-angle-up
            </div>
            <div class="code-name">.icon-iconfontangleup
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontcite"></span>
            <div class="name">
              iconfont-cite
            </div>
            <div class="code-name">.icon-iconfontcite
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontdelete"></span>
            <div class="name">
              iconfont-delete
            </div>
            <div class="code-name">.icon-iconfontdelete
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontdisorder"></span>
            <div class="name">
              iconfont-disorder
            </div>
            <div class="code-name">.icon-iconfontdisorder
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontdown"></span>
            <div class="name">
              iconfont-down
            </div>
            <div class="code-name">.icon-iconfontdown
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontgrid"></span>
            <div class="name">
              iconfont-grid
            </div>
            <div class="code-name">.icon-iconfontgrid
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfonticonfontcart"></span>
            <div class="name">
              iconfont-iconfontcart
            </div>
            <div class="code-name">.icon-iconfonticonfontcart
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfonticonfontclose"></span>
            <div class="name">
              iconfont-iconfontclose
            </div>
            <div class="code-name">.icon-iconfonticonfontclose
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfonticonfontclosefill"></span>
            <div class="name">
              iconfont-iconfontclosefill
            </div>
            <div class="code-name">.icon-iconfonticonfontclosefill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfonticonfontdingwei"></span>
            <div class="name">
              iconfont-iconfontdingwei
            </div>
            <div class="code-name">.icon-iconfonticonfontdingwei
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfonticonfonterweima"></span>
            <div class="name">
              iconfont-iconfonterweima
            </div>
            <div class="code-name">.icon-iconfonticonfonterweima
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfonticonfontroundadd"></span>
            <div class="name">
              iconfont-iconfontroundadd
            </div>
            <div class="code-name">.icon-iconfonticonfontroundadd
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfonticonfontroundaddfill"></span>
            <div class="name">
              iconfont-iconfontroundaddfill
            </div>
            <div class="code-name">.icon-iconfonticonfontroundaddfill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfonticonfontweibo"></span>
            <div class="name">
              iconfont-iconfontweibo
            </div>
            <div class="code-name">.icon-iconfonticonfontweibo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfonticonfontweizhi"></span>
            <div class="name">
              iconfont-iconfontweizhi
            </div>
            <div class="code-name">.icon-iconfonticonfontweizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfonticonposition11"></span>
            <div class="name">
              iconfont-iconposition(1)
            </div>
            <div class="code-name">.icon-iconfonticonposition11
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontkuaixiufuwu11"></span>
            <div class="name">
              iconfont-kuaixiufuwu(1)
            </div>
            <div class="code-name">.icon-iconfontkuaixiufuwu11
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontleft1"></span>
            <div class="name">
              iconfont-left(1)
            </div>
            <div class="code-name">.icon-iconfontleft1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontleft"></span>
            <div class="name">
              iconfont-left
            </div>
            <div class="code-name">.icon-iconfontleft
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontlist"></span>
            <div class="name">
              iconfont-list
            </div>
            <div class="code-name">.icon-iconfontlist
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontphonebook"></span>
            <div class="name">
              iconfont-phonebook
            </div>
            <div class="code-name">.icon-iconfontphonebook
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontqm"></span>
            <div class="name">
              iconfont-qm
            </div>
            <div class="code-name">.icon-iconfontqm
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontright1"></span>
            <div class="name">
              iconfont-right(1)
            </div>
            <div class="code-name">.icon-iconfontright1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontright"></span>
            <div class="name">
              iconfont-right
            </div>
            <div class="code-name">.icon-iconfontright
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontsocialgoogle"></span>
            <div class="name">
              iconfont-socialgoogle
            </div>
            <div class="code-name">.icon-iconfontsocialgoogle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontsocialgoogleoutline"></span>
            <div class="name">
              iconfont-socialgoogleoutline
            </div>
            <div class="code-name">.icon-iconfontsocialgoogleoutline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontsocialgoogleplus"></span>
            <div class="name">
              iconfont-socialgoogleplus
            </div>
            <div class="code-name">.icon-iconfontsocialgoogleplus
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontsocialgoogleplusoutline"></span>
            <div class="name">
              iconfont-socialgoogleplusoutline
            </div>
            <div class="code-name">.icon-iconfontsocialgoogleplusoutline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontsocialjavascript"></span>
            <div class="name">
              iconfont-socialjavascript
            </div>
            <div class="code-name">.icon-iconfontsocialjavascript
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontsocialhtml5"></span>
            <div class="name">
              iconfont-socialhtml5
            </div>
            <div class="code-name">.icon-iconfontsocialhtml5
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontsocialhtml5outline"></span>
            <div class="name">
              iconfont-socialhtml5outline
            </div>
            <div class="code-name">.icon-iconfontsocialhtml5outline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontsocialjavascript1"></span>
            <div class="name">
              iconfont-socialjavascript
            </div>
            <div class="code-name">.icon-iconfontsocialjavascript1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontsocialjavascriptoutline"></span>
            <div class="name">
              iconfont-socialjavascriptoutline
            </div>
            <div class="code-name">.icon-iconfontsocialjavascriptoutline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontsocialtumblr"></span>
            <div class="name">
              iconfont-socialtumblr
            </div>
            <div class="code-name">.icon-iconfontsocialtumblr
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontsocialtumblroutline"></span>
            <div class="name">
              iconfont-socialtumblroutline
            </div>
            <div class="code-name">.icon-iconfontsocialtumblroutline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontstar"></span>
            <div class="name">
              iconfont-star
            </div>
            <div class="code-name">.icon-iconfontstar
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfonttrash"></span>
            <div class="name">
              iconfont-trash
            </div>
            <div class="code-name">.icon-iconfonttrash
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontup"></span>
            <div class="name">
              iconfont-up
            </div>
            <div class="code-name">.icon-iconfontup
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontzaixiankefu11"></span>
            <div class="name">
              iconfont-zaixiankefu(1)
            </div>
            <div class="code-name">.icon-iconfontzaixiankefu11
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-biaoqianA01_pifu-46"></span>
            <div class="name">
              皮肤
            </div>
            <div class="code-name">.icon-biaoqianA01_pifu-46
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-biaoqianA01_gongju-47"></span>
            <div class="name">
              工具
            </div>
            <div class="code-name">.icon-biaoqianA01_gongju-47
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-biaoqiankuozhan_shipin-188"></span>
            <div class="name">
              视频
            </div>
            <div class="code-name">.icon-biaoqiankuozhan_shipin-188
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-biaoqiankuozhan_liaotian-397"></span>
            <div class="name">
              聊天
            </div>
            <div class="code-name">.icon-biaoqiankuozhan_liaotian-397
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-biaoqiankuozhan_fujin-398"></span>
            <div class="name">
              附近
            </div>
            <div class="code-name">.icon-biaoqiankuozhan_fujin-398
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-biaoqiankuozhan_tuijian-399"></span>
            <div class="name">
              推荐
            </div>
            <div class="code-name">.icon-biaoqiankuozhan_tuijian-399
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-guanfangkefu"></span>
            <div class="name">
              官方客服
            </div>
            <div class="code-name">.icon-guanfangkefu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-more-circle"></span>
            <div class="name">
              more-circle
            </div>
            <div class="code-name">.icon-more-circle
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jinhangzhong"></span>
            <div class="name">
              进行中
            </div>
            <div class="code-name">.icon-jinhangzhong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-chakansousuo"></span>
            <div class="name">
              查看 搜索
            </div>
            <div class="code-name">.icon-a-chakansousuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dakai"></span>
            <div class="name">
              打开
            </div>
            <div class="code-name">.icon-dakai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-chaxun"></span>
            <div class="name">
              查询
            </div>
            <div class="code-name">.icon-chaxun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-hezuo2"></span>
            <div class="name">
              合作伙伴
            </div>
            <div class="code-name">.icon-a-hezuo2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-gongzuoguanli-huiyiguanli2"></span>
            <div class="name">
              项目复盘
            </div>
            <div class="code-name">.icon-a-gongzuoguanli-huiyiguanli2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-shalou1"></span>
            <div class="name">
              所有项目进度
            </div>
            <div class="code-name">.icon-a-shalou1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-banjiguanli2x"></span>
            <div class="name">
              详细方案
            </div>
            <div class="code-name">.icon-a-banjiguanli2x
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-jifen2"></span>
            <div class="name">
              积分记录
            </div>
            <div class="code-name">.icon-a-jifen2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-pingguguanli1"></span>
            <div class="name">
              技术评估
            </div>
            <div class="code-name">.icon-a-pingguguanli1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-shiyanjilu4"></span>
            <div class="name">
              需求管理
            </div>
            <div class="code-name">.icon-a-shiyanjilu4
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-jungong-22"></span>
            <div class="name">
              竣工交付
            </div>
            <div class="code-name">.icon-a-jungong-22
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-xianchangkantan2"></span>
            <div class="name">
              技术踏勘
            </div>
            <div class="code-name">.icon-a-xianchangkantan2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-qingjia2"></span>
            <div class="name">
              请假审批
            </div>
            <div class="code-name">.icon-a-qingjia2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-caigoudingdan2"></span>
            <div class="name">
              实施采购
            </div>
            <div class="code-name">.icon-a-caigoudingdan2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-shigong052"></span>
            <div class="name">
              实施踏勘
            </div>
            <div class="code-name">.icon-a-shigong052
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-xiangmuguanli3"></span>
            <div class="name">
              项目管理
            </div>
            <div class="code-name">.icon-a-xiangmuguanli3
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-Group427318885"></span>
            <div class="name">
              项目报备
            </div>
            <div class="code-name">.icon-a-Group427318885
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-yiqidong2"></span>
            <div class="name">
              项目启动
            </div>
            <div class="code-name">.icon-a-yiqidong2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-shigongbaogaochakan2"></span>
            <div class="name">
              实施管理
            </div>
            <div class="code-name">.icon-a-shigongbaogaochakan2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-shouji1"></span>
            <div class="name">
              手机配置
            </div>
            <div class="code-name">.icon-a-shouji1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-bug2"></span>
            <div class="name">
              Bug管理
            </div>
            <div class="code-name">.icon-a-bug2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-tuanduizuzhijiagoushequn-062"></span>
            <div class="name">
              部门管理
            </div>
            <div class="code-name">.icon-a-tuanduizuzhijiagoushequn-062
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-Group427319236"></span>
            <div class="name">
              项目评价
            </div>
            <div class="code-name">.icon-a-Group427319236
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-Group427319243"></span>
            <div class="name">
              文档管理
            </div>
            <div class="code-name">.icon-a-Group427319243
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-renyuanlianjietianjia2"></span>
            <div class="name">
              I需求对接
            </div>
            <div class="code-name">.icon-a-renyuanlianjietianjia2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-shangwuhetong2"></span>
            <div class="name">
              合同拟定
            </div>
            <div class="code-name">.icon-a-shangwuhetong2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-xinyongbaobiao2"></span>
            <div class="name">
              项目清单
            </div>
            <div class="code-name">.icon-a-xinyongbaobiao2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-zhaobiaofangan4"></span>
            <div class="name">
              初步方案
            </div>
            <div class="code-name">.icon-a-zhaobiaofangan4
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-keyipingtaihezuofangan2"></span>
            <div class="name">
              最终方案
            </div>
            <div class="code-name">.icon-a-keyipingtaihezuofangan2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-zanting2"></span>
            <div class="name">
              暂停项目
            </div>
            <div class="code-name">.icon-a-zanting2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-Group427319242"></span>
            <div class="name">
              III实施交付
            </div>
            <div class="code-name">.icon-a-Group427319242
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-wenjianjia2"></span>
            <div class="name">
              项目文件
            </div>
            <div class="code-name">.icon-a-wenjianjia2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-yilaiku2"></span>
            <div class="name">
              项目详情
            </div>
            <div class="code-name">.icon-a-yilaiku2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-ITyingyongxuqiuguanliliucheng-042"></span>
            <div class="name">
              项目详情
            </div>
            <div class="code-name">.icon-a-ITyingyongxuqiuguanliliucheng-042
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-Group427319241"></span>
            <div class="name">
              II落地签约
            </div>
            <div class="code-name">.icon-a-Group427319241
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-laba2"></span>
            <div class="name">
              新闻公告
            </div>
            <div class="code-name">.icon-a-laba2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon-shijian"></span>
            <div class="name">
              icon-时间
            </div>
            <div class="code-name">.icon-icon-shijian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-format07"></span>
            <div class="name">
              城市
            </div>
            <div class="code-name">.icon-format07
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuju"></span>
            <div class="name">
              数据
            </div>
            <div class="code-name">.icon-shuju
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-baoxian-xian"></span>
            <div class="name">
              保险-线
            </div>
            <div class="code-name">.icon-baoxian-xian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fanhui2-xian"></span>
            <div class="name">
              返回2-线
            </div>
            <div class="code-name">.icon-fanhui2-xian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-gengduo-xian"></span>
            <div class="name">
              更多-线
            </div>
            <div class="code-name">.icon-gengduo-xian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxing-liwu"></span>
            <div class="name">
              面性-礼物
            </div>
            <div class="code-name">.icon-mianxing-liwu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shoujihaoicon"></span>
            <div class="name">
              手机号icon
            </div>
            <div class="code-name">.icon-shoujihaoicon
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-sousuo"></span>
            <div class="name">
              搜索
            </div>
            <div class="code-name">.icon-sousuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-banbenxinxi"></span>
            <div class="name">
              版本信息
            </div>
            <div class="code-name">.icon-banbenxinxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jianchagengxin"></span>
            <div class="name">
              检查更新
            </div>
            <div class="code-name">.icon-jianchagengxin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dengludengru"></span>
            <div class="name">
              登陆登入
            </div>
            <div class="code-name">.icon-dengludengru
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shangchuanwenjian"></span>
            <div class="name">
              上传文件
            </div>
            <div class="code-name">.icon-shangchuanwenjian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-qiehuanbiaoqianfeiyushi"></span>
            <div class="name">
              切换标签非是
            </div>
            <div class="code-name">.icon-qiehuanbiaoqianfeiyushi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuaxin_tongbu"></span>
            <div class="name">
              刷新同步
            </div>
            <div class="code-name">.icon-shuaxin_tongbu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuaxinxiangmu"></span>
            <div class="name">
              刷新项目
            </div>
            <div class="code-name">.icon-shuaxinxiangmu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tuichudengchu"></span>
            <div class="name">
              退出登出
            </div>
            <div class="code-name">.icon-tuichudengchu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-denglushishezhifuwuqidizhi"></span>
            <div class="name">
              设置服务器
            </div>
            <div class="code-name">.icon-denglushishezhifuwuqidizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiazaidigao"></span>
            <div class="name">
              下载底稿
            </div>
            <div class="code-name">.icon-xiazaidigao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-_"></span>
            <div class="name">
              疑问
            </div>
            <div class="code-name">.icon-_
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-huizongjiesuo"></span>
            <div class="name">
              汇总解锁
            </div>
            <div class="code-name">.icon-huizongjiesuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiancha"></span>
            <div class="name">
              检查
            </div>
            <div class="code-name">.icon-jiancha
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dakaiwenjianjia"></span>
            <div class="name">
              打开文件夹
            </div>
            <div class="code-name">.icon-dakaiwenjianjia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shezhigongzuomulu"></span>
            <div class="name">
              设置工作目录
            </div>
            <div class="code-name">.icon-shezhigongzuomulu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shangchuancuowurizhi"></span>
            <div class="name">
              上传错误日志
            </div>
            <div class="code-name">.icon-shangchuancuowurizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-qiehuanbaogaomingxi"></span>
            <div class="name">
              切换报告明细
            </div>
            <div class="code-name">.icon-qiehuanbaogaomingxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-banbenguanli"></span>
            <div class="name">
              版本管理
            </div>
            <div class="code-name">.icon-banbenguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-biaoqianjiesuo"></span>
            <div class="name">
              标签解锁
            </div>
            <div class="code-name">.icon-biaoqianjiesuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-daibiaoqian"></span>
            <div class="name">
              带标签
            </div>
            <div class="code-name">.icon-daibiaoqian
            </div>
          </li>
          
        </ul>
        <div class="article markdown">
        <h2 id="font-class-">font-class 引用</h2>
        <hr>

        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
        <p>与 Unicode 使用方式相比，具有如下特点：</p>
        <ul>
          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
</code></pre>
        <blockquote>
          <p>"
            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
        </blockquote>
      </div>
      </div>
      <div class="content symbol">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fenxiang"></use>
                </svg>
                <div class="name">分享</div>
                <div class="code-name">#icon-fenxiang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fenxiang2"></use>
                </svg>
                <div class="name">分享</div>
                <div class="code-name">#icon-fenxiang2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-pinglun"></use>
                </svg>
                <div class="name">评论</div>
                <div class="code-name">#icon-pinglun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shipin"></use>
                </svg>
                <div class="name">视频</div>
                <div class="code-name">#icon-shipin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-chongzhi"></use>
                </svg>
                <div class="name">充值</div>
                <div class="code-name">#icon-chongzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dizhi"></use>
                </svg>
                <div class="name">地址</div>
                <div class="code-name">#icon-dizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-kefu"></use>
                </svg>
                <div class="name">客服</div>
                <div class="code-name">#icon-kefu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfont7tian"></use>
                </svg>
                <div class="name">iconfont-7tian</div>
                <div class="code-name">#icon-iconfont7tian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfont15tianwuliyoutuihuo1"></use>
                </svg>
                <div class="name">iconfont-15tianwuliyoutuihuo(1)</div>
                <div class="code-name">#icon-iconfont15tianwuliyoutuihuo1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontbaoyou1"></use>
                </svg>
                <div class="name">iconfont-baoyou(1)</div>
                <div class="code-name">#icon-iconfontbaoyou1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfonticonposition1"></use>
                </svg>
                <div class="name">iconfont-iconposition(1)</div>
                <div class="code-name">#icon-iconfonticonposition1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontkuaixiufuwu1"></use>
                </svg>
                <div class="name">iconfont-kuaixiufuwu(1)</div>
                <div class="code-name">#icon-iconfontkuaixiufuwu1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontzaixiankefu1"></use>
                </svg>
                <div class="name">iconfont-zaixiankefu(1)</div>
                <div class="code-name">#icon-iconfontzaixiankefu1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfont1"></use>
                </svg>
                <div class="name">iconfont-1</div>
                <div class="code-name">#icon-iconfont1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfont2"></use>
                </svg>
                <div class="name">iconfont-2</div>
                <div class="code-name">#icon-iconfont2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfont7tian1"></use>
                </svg>
                <div class="name">iconfont-7tian</div>
                <div class="code-name">#icon-iconfont7tian1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontangleleft"></use>
                </svg>
                <div class="name">iconfont-angle-left</div>
                <div class="code-name">#icon-iconfontangleleft</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontangleright"></use>
                </svg>
                <div class="name">iconfont-angle-right</div>
                <div class="code-name">#icon-iconfontangleright</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontangleup"></use>
                </svg>
                <div class="name">iconfont-angle-up</div>
                <div class="code-name">#icon-iconfontangleup</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontcite"></use>
                </svg>
                <div class="name">iconfont-cite</div>
                <div class="code-name">#icon-iconfontcite</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontdelete"></use>
                </svg>
                <div class="name">iconfont-delete</div>
                <div class="code-name">#icon-iconfontdelete</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontdisorder"></use>
                </svg>
                <div class="name">iconfont-disorder</div>
                <div class="code-name">#icon-iconfontdisorder</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontdown"></use>
                </svg>
                <div class="name">iconfont-down</div>
                <div class="code-name">#icon-iconfontdown</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontgrid"></use>
                </svg>
                <div class="name">iconfont-grid</div>
                <div class="code-name">#icon-iconfontgrid</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfonticonfontcart"></use>
                </svg>
                <div class="name">iconfont-iconfontcart</div>
                <div class="code-name">#icon-iconfonticonfontcart</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfonticonfontclose"></use>
                </svg>
                <div class="name">iconfont-iconfontclose</div>
                <div class="code-name">#icon-iconfonticonfontclose</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfonticonfontclosefill"></use>
                </svg>
                <div class="name">iconfont-iconfontclosefill</div>
                <div class="code-name">#icon-iconfonticonfontclosefill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfonticonfontdingwei"></use>
                </svg>
                <div class="name">iconfont-iconfontdingwei</div>
                <div class="code-name">#icon-iconfonticonfontdingwei</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfonticonfonterweima"></use>
                </svg>
                <div class="name">iconfont-iconfonterweima</div>
                <div class="code-name">#icon-iconfonticonfonterweima</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfonticonfontroundadd"></use>
                </svg>
                <div class="name">iconfont-iconfontroundadd</div>
                <div class="code-name">#icon-iconfonticonfontroundadd</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfonticonfontroundaddfill"></use>
                </svg>
                <div class="name">iconfont-iconfontroundaddfill</div>
                <div class="code-name">#icon-iconfonticonfontroundaddfill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfonticonfontweibo"></use>
                </svg>
                <div class="name">iconfont-iconfontweibo</div>
                <div class="code-name">#icon-iconfonticonfontweibo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfonticonfontweizhi"></use>
                </svg>
                <div class="name">iconfont-iconfontweizhi</div>
                <div class="code-name">#icon-iconfonticonfontweizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfonticonposition11"></use>
                </svg>
                <div class="name">iconfont-iconposition(1)</div>
                <div class="code-name">#icon-iconfonticonposition11</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontkuaixiufuwu11"></use>
                </svg>
                <div class="name">iconfont-kuaixiufuwu(1)</div>
                <div class="code-name">#icon-iconfontkuaixiufuwu11</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontleft1"></use>
                </svg>
                <div class="name">iconfont-left(1)</div>
                <div class="code-name">#icon-iconfontleft1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontleft"></use>
                </svg>
                <div class="name">iconfont-left</div>
                <div class="code-name">#icon-iconfontleft</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontlist"></use>
                </svg>
                <div class="name">iconfont-list</div>
                <div class="code-name">#icon-iconfontlist</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontphonebook"></use>
                </svg>
                <div class="name">iconfont-phonebook</div>
                <div class="code-name">#icon-iconfontphonebook</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontqm"></use>
                </svg>
                <div class="name">iconfont-qm</div>
                <div class="code-name">#icon-iconfontqm</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontright1"></use>
                </svg>
                <div class="name">iconfont-right(1)</div>
                <div class="code-name">#icon-iconfontright1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontright"></use>
                </svg>
                <div class="name">iconfont-right</div>
                <div class="code-name">#icon-iconfontright</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontsocialgoogle"></use>
                </svg>
                <div class="name">iconfont-socialgoogle</div>
                <div class="code-name">#icon-iconfontsocialgoogle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontsocialgoogleoutline"></use>
                </svg>
                <div class="name">iconfont-socialgoogleoutline</div>
                <div class="code-name">#icon-iconfontsocialgoogleoutline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontsocialgoogleplus"></use>
                </svg>
                <div class="name">iconfont-socialgoogleplus</div>
                <div class="code-name">#icon-iconfontsocialgoogleplus</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontsocialgoogleplusoutline"></use>
                </svg>
                <div class="name">iconfont-socialgoogleplusoutline</div>
                <div class="code-name">#icon-iconfontsocialgoogleplusoutline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontsocialjavascript"></use>
                </svg>
                <div class="name">iconfont-socialjavascript</div>
                <div class="code-name">#icon-iconfontsocialjavascript</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontsocialhtml5"></use>
                </svg>
                <div class="name">iconfont-socialhtml5</div>
                <div class="code-name">#icon-iconfontsocialhtml5</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontsocialhtml5outline"></use>
                </svg>
                <div class="name">iconfont-socialhtml5outline</div>
                <div class="code-name">#icon-iconfontsocialhtml5outline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontsocialjavascript1"></use>
                </svg>
                <div class="name">iconfont-socialjavascript</div>
                <div class="code-name">#icon-iconfontsocialjavascript1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontsocialjavascriptoutline"></use>
                </svg>
                <div class="name">iconfont-socialjavascriptoutline</div>
                <div class="code-name">#icon-iconfontsocialjavascriptoutline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontsocialtumblr"></use>
                </svg>
                <div class="name">iconfont-socialtumblr</div>
                <div class="code-name">#icon-iconfontsocialtumblr</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontsocialtumblroutline"></use>
                </svg>
                <div class="name">iconfont-socialtumblroutline</div>
                <div class="code-name">#icon-iconfontsocialtumblroutline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontstar"></use>
                </svg>
                <div class="name">iconfont-star</div>
                <div class="code-name">#icon-iconfontstar</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfonttrash"></use>
                </svg>
                <div class="name">iconfont-trash</div>
                <div class="code-name">#icon-iconfonttrash</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontup"></use>
                </svg>
                <div class="name">iconfont-up</div>
                <div class="code-name">#icon-iconfontup</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontzaixiankefu11"></use>
                </svg>
                <div class="name">iconfont-zaixiankefu(1)</div>
                <div class="code-name">#icon-iconfontzaixiankefu11</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-biaoqianA01_pifu-46"></use>
                </svg>
                <div class="name">皮肤</div>
                <div class="code-name">#icon-biaoqianA01_pifu-46</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-biaoqianA01_gongju-47"></use>
                </svg>
                <div class="name">工具</div>
                <div class="code-name">#icon-biaoqianA01_gongju-47</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-biaoqiankuozhan_shipin-188"></use>
                </svg>
                <div class="name">视频</div>
                <div class="code-name">#icon-biaoqiankuozhan_shipin-188</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-biaoqiankuozhan_liaotian-397"></use>
                </svg>
                <div class="name">聊天</div>
                <div class="code-name">#icon-biaoqiankuozhan_liaotian-397</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-biaoqiankuozhan_fujin-398"></use>
                </svg>
                <div class="name">附近</div>
                <div class="code-name">#icon-biaoqiankuozhan_fujin-398</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-biaoqiankuozhan_tuijian-399"></use>
                </svg>
                <div class="name">推荐</div>
                <div class="code-name">#icon-biaoqiankuozhan_tuijian-399</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-guanfangkefu"></use>
                </svg>
                <div class="name">官方客服</div>
                <div class="code-name">#icon-guanfangkefu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-more-circle"></use>
                </svg>
                <div class="name">more-circle</div>
                <div class="code-name">#icon-more-circle</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jinhangzhong"></use>
                </svg>
                <div class="name">进行中</div>
                <div class="code-name">#icon-jinhangzhong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-chakansousuo"></use>
                </svg>
                <div class="name">查看 搜索</div>
                <div class="code-name">#icon-a-chakansousuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dakai"></use>
                </svg>
                <div class="name">打开</div>
                <div class="code-name">#icon-dakai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-chaxun"></use>
                </svg>
                <div class="name">查询</div>
                <div class="code-name">#icon-chaxun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-hezuo2"></use>
                </svg>
                <div class="name">合作伙伴</div>
                <div class="code-name">#icon-a-hezuo2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-gongzuoguanli-huiyiguanli2"></use>
                </svg>
                <div class="name">项目复盘</div>
                <div class="code-name">#icon-a-gongzuoguanli-huiyiguanli2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-shalou1"></use>
                </svg>
                <div class="name">所有项目进度</div>
                <div class="code-name">#icon-a-shalou1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-banjiguanli2x"></use>
                </svg>
                <div class="name">详细方案</div>
                <div class="code-name">#icon-a-banjiguanli2x</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-jifen2"></use>
                </svg>
                <div class="name">积分记录</div>
                <div class="code-name">#icon-a-jifen2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-pingguguanli1"></use>
                </svg>
                <div class="name">技术评估</div>
                <div class="code-name">#icon-a-pingguguanli1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-shiyanjilu4"></use>
                </svg>
                <div class="name">需求管理</div>
                <div class="code-name">#icon-a-shiyanjilu4</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-jungong-22"></use>
                </svg>
                <div class="name">竣工交付</div>
                <div class="code-name">#icon-a-jungong-22</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-xianchangkantan2"></use>
                </svg>
                <div class="name">技术踏勘</div>
                <div class="code-name">#icon-a-xianchangkantan2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-qingjia2"></use>
                </svg>
                <div class="name">请假审批</div>
                <div class="code-name">#icon-a-qingjia2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-caigoudingdan2"></use>
                </svg>
                <div class="name">实施采购</div>
                <div class="code-name">#icon-a-caigoudingdan2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-shigong052"></use>
                </svg>
                <div class="name">实施踏勘</div>
                <div class="code-name">#icon-a-shigong052</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-xiangmuguanli3"></use>
                </svg>
                <div class="name">项目管理</div>
                <div class="code-name">#icon-a-xiangmuguanli3</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-Group427318885"></use>
                </svg>
                <div class="name">项目报备</div>
                <div class="code-name">#icon-a-Group427318885</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-yiqidong2"></use>
                </svg>
                <div class="name">项目启动</div>
                <div class="code-name">#icon-a-yiqidong2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-shigongbaogaochakan2"></use>
                </svg>
                <div class="name">实施管理</div>
                <div class="code-name">#icon-a-shigongbaogaochakan2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-shouji1"></use>
                </svg>
                <div class="name">手机配置</div>
                <div class="code-name">#icon-a-shouji1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-bug2"></use>
                </svg>
                <div class="name">Bug管理</div>
                <div class="code-name">#icon-a-bug2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-tuanduizuzhijiagoushequn-062"></use>
                </svg>
                <div class="name">部门管理</div>
                <div class="code-name">#icon-a-tuanduizuzhijiagoushequn-062</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-Group427319236"></use>
                </svg>
                <div class="name">项目评价</div>
                <div class="code-name">#icon-a-Group427319236</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-Group427319243"></use>
                </svg>
                <div class="name">文档管理</div>
                <div class="code-name">#icon-a-Group427319243</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-renyuanlianjietianjia2"></use>
                </svg>
                <div class="name">I需求对接</div>
                <div class="code-name">#icon-a-renyuanlianjietianjia2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-shangwuhetong2"></use>
                </svg>
                <div class="name">合同拟定</div>
                <div class="code-name">#icon-a-shangwuhetong2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-xinyongbaobiao2"></use>
                </svg>
                <div class="name">项目清单</div>
                <div class="code-name">#icon-a-xinyongbaobiao2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-zhaobiaofangan4"></use>
                </svg>
                <div class="name">初步方案</div>
                <div class="code-name">#icon-a-zhaobiaofangan4</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-keyipingtaihezuofangan2"></use>
                </svg>
                <div class="name">最终方案</div>
                <div class="code-name">#icon-a-keyipingtaihezuofangan2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-zanting2"></use>
                </svg>
                <div class="name">暂停项目</div>
                <div class="code-name">#icon-a-zanting2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-Group427319242"></use>
                </svg>
                <div class="name">III实施交付</div>
                <div class="code-name">#icon-a-Group427319242</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-wenjianjia2"></use>
                </svg>
                <div class="name">项目文件</div>
                <div class="code-name">#icon-a-wenjianjia2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-yilaiku2"></use>
                </svg>
                <div class="name">项目详情</div>
                <div class="code-name">#icon-a-yilaiku2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-ITyingyongxuqiuguanliliucheng-042"></use>
                </svg>
                <div class="name">项目详情</div>
                <div class="code-name">#icon-a-ITyingyongxuqiuguanliliucheng-042</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-Group427319241"></use>
                </svg>
                <div class="name">II落地签约</div>
                <div class="code-name">#icon-a-Group427319241</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-laba2"></use>
                </svg>
                <div class="name">新闻公告</div>
                <div class="code-name">#icon-a-laba2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon-shijian"></use>
                </svg>
                <div class="name">icon-时间</div>
                <div class="code-name">#icon-icon-shijian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-format07"></use>
                </svg>
                <div class="name">城市</div>
                <div class="code-name">#icon-format07</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuju"></use>
                </svg>
                <div class="name">数据</div>
                <div class="code-name">#icon-shuju</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-baoxian-xian"></use>
                </svg>
                <div class="name">保险-线</div>
                <div class="code-name">#icon-baoxian-xian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fanhui2-xian"></use>
                </svg>
                <div class="name">返回2-线</div>
                <div class="code-name">#icon-fanhui2-xian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gengduo-xian"></use>
                </svg>
                <div class="name">更多-线</div>
                <div class="code-name">#icon-gengduo-xian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxing-liwu"></use>
                </svg>
                <div class="name">面性-礼物</div>
                <div class="code-name">#icon-mianxing-liwu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shoujihaoicon"></use>
                </svg>
                <div class="name">手机号icon</div>
                <div class="code-name">#icon-shoujihaoicon</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sousuo"></use>
                </svg>
                <div class="name">搜索</div>
                <div class="code-name">#icon-sousuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-banbenxinxi"></use>
                </svg>
                <div class="name">版本信息</div>
                <div class="code-name">#icon-banbenxinxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jianchagengxin"></use>
                </svg>
                <div class="name">检查更新</div>
                <div class="code-name">#icon-jianchagengxin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dengludengru"></use>
                </svg>
                <div class="name">登陆登入</div>
                <div class="code-name">#icon-dengludengru</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shangchuanwenjian"></use>
                </svg>
                <div class="name">上传文件</div>
                <div class="code-name">#icon-shangchuanwenjian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-qiehuanbiaoqianfeiyushi"></use>
                </svg>
                <div class="name">切换标签非是</div>
                <div class="code-name">#icon-qiehuanbiaoqianfeiyushi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuaxin_tongbu"></use>
                </svg>
                <div class="name">刷新同步</div>
                <div class="code-name">#icon-shuaxin_tongbu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuaxinxiangmu"></use>
                </svg>
                <div class="name">刷新项目</div>
                <div class="code-name">#icon-shuaxinxiangmu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tuichudengchu"></use>
                </svg>
                <div class="name">退出登出</div>
                <div class="code-name">#icon-tuichudengchu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-denglushishezhifuwuqidizhi"></use>
                </svg>
                <div class="name">设置服务器</div>
                <div class="code-name">#icon-denglushishezhifuwuqidizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiazaidigao"></use>
                </svg>
                <div class="name">下载底稿</div>
                <div class="code-name">#icon-xiazaidigao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-_"></use>
                </svg>
                <div class="name">疑问</div>
                <div class="code-name">#icon-_</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-huizongjiesuo"></use>
                </svg>
                <div class="name">汇总解锁</div>
                <div class="code-name">#icon-huizongjiesuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiancha"></use>
                </svg>
                <div class="name">检查</div>
                <div class="code-name">#icon-jiancha</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dakaiwenjianjia"></use>
                </svg>
                <div class="name">打开文件夹</div>
                <div class="code-name">#icon-dakaiwenjianjia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shezhigongzuomulu"></use>
                </svg>
                <div class="name">设置工作目录</div>
                <div class="code-name">#icon-shezhigongzuomulu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shangchuancuowurizhi"></use>
                </svg>
                <div class="name">上传错误日志</div>
                <div class="code-name">#icon-shangchuancuowurizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-qiehuanbaogaomingxi"></use>
                </svg>
                <div class="name">切换报告明细</div>
                <div class="code-name">#icon-qiehuanbaogaomingxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-banbenguanli"></use>
                </svg>
                <div class="name">版本管理</div>
                <div class="code-name">#icon-banbenguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-biaoqianjiesuo"></use>
                </svg>
                <div class="name">标签解锁</div>
                <div class="code-name">#icon-biaoqianjiesuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-daibiaoqian"></use>
                </svg>
                <div class="name">带标签</div>
                <div class="code-name">#icon-daibiaoqian</div>
            </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="symbol-">Symbol 引用</h2>
          <hr>

          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
          <ul>
            <li>支持多色图标了，不再受单色限制。</li>
            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
          </ul>
          <p>使用步骤如下：</p>
          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
&lt;/style&gt;
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
          </div>
      </div>

    </div>
  </div>
  <script>
  $(document).ready(function () {
      $('.tab-container .content:first').show()

      $('#tabs li').click(function (e) {
        var tabContent = $('.tab-container .content')
        var index = $(this).index()

        if ($(this).hasClass('active')) {
          return
        } else {
          $('#tabs li').removeClass('active')
          $(this).addClass('active')

          tabContent.hide().eq(index).fadeIn()
        }
      })
    })
  </script>
</body>
</html>
